<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>20.解决回调地狱</title>
</head>
<body>

<script>
  //这种一层套一层的回调函数又称为回调地狱
  // setTimeout(function () {
  //   console.log('第一层')
  //   setTimeout(function () {
  //     console.log('第二层')
  //     setTimeout(function () {
  //       console.log('第三层')
  //     },3000)
  //   },2000)
  // },1000)

  function one() {
    setTimeout(function () {
      console.log('第一层')
      iter.next()
    },1000)
  }

  function two() {
    setTimeout(function () {
      console.log('第二层')
      iter.next()
    },2000)
  }

  function three() {
    setTimeout(function () {
      console.log('第三层')
      iter.next()
    },3000)
  }

  function * f1() {
    one();
    yield ''
    two();
    yield ''
    three();
    yield ''
  }

  let iter = f1()
  iter.next()

  //不能连续三次next，这样就是连续设置三个定时器，总耗时还是三秒
  //应该在每个回调函数结束的时候调用一次next，执行下一个定时器，这样耗时就是6秒
  // iter.next()
  // iter.next()
  // iter.next()





</script>
</body>
</html>